<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/component/commonTagLib.jsp" %>

<!DOCTYPE html>
<html>
<head>
    <title>草稿箱</title>
    <%@ include file="/WEB-INF/component/commonCSS.jsp" %>
</head>
<body class="skin-blue-light sidebar-mini fixed skin-blue-light-frame">
							
    <section class="content-header">
        <h1>草稿箱</h1>
        <ol class="breadcrumb">
            <li><a href="${ctx}/home.jsp"><i class="fa fa-home"></i><spring:message code="message.lable.first"/></a></li>
            <li class="active"><a href="#">消息管理</a></li>
            <li class="active"><a href="#">草稿箱</a></li>
        </ol>
    </section>
    
    <section class="content">
       <div class=" box box-success">
		<div class="box-body"  >
		    <div class="input">
		       <div class="textalign1">消息标题：</div>
               <div class="boxinput">
                        <input type="text" class="textinput" id="titleTitle" placeholder="消息标题" maxlength="64"/>
               </div>	
               <div class="textalign">消息类型：</div>
               <div class="boxinput">
                        <select class="textinput " name="type" id="schType">
                            <option value=""><spring:message code="message.select.option"/></option>
                            <option value="1">系统消息</option>
                             <option value="2">用户消息</option>
                        </select>
               </div>	   
		   
               <div class="textalign1">
		             <button type="button" class="btn btn-success btn-sm" onclick="search();" id="selectDicCompType"><spring:message code="message.button.seachSpacing"/></button>
		       </div>
		    </div>
		    </div>
		</div>
        
        <table class="jqgrid" id="gridlist"></table>
        <div id="gridpage"></div>
         <div class=" box box-warning bottongroup">
           <ms:btn url="/sysMessage/save.html"><label id="addNew" class="btn btn-primary btn-sm"><spring:message code="message.button.addSpacing"/></label></ms:btn>
       </div>
       
         <div class="modal fade" id="exampleModal" tabindex="-1" >
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header bg-primary">
                        <button type="button" class="close" data-dismiss="modal" ><span >&times;</span></button>
                        <h5 class="modal-title" id="exampleModalLabel">消息新建</h5>
                    </div>
                    <div class="modal-body">
                  <form  class="form-horizontal" action="${ctx}/sysMessage/saveOrUpDate.html" id="addForm" method="post" enctype="multipart/form-data">
                    <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><span class="required">*</span>接收人：</label>
                        <div class="col-sm-8 text-left">
                        <input id="messageId" name="messageId" type="hidden" >
                        <input id="receUser" name="receUser" type="hidden" >
                         <input id="status" name="status" type="hidden" >
                         <input id="receType" name="receType" type="hidden" >
                         <input id="receOrgId" name="receOrgId" type="hidden" >
                            <input class=" form-control" placeholder="接收人" disabled="disabled" id="receUserName" type="text" >
                        </div>
                        <div> <button type="button" class="btn btn-primary btn-sm" id="addRece"  onclick="addUser();" >添&nbsp;加</button></div>
                   </div>
                   <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><span class="required">*</span>标题：</label>
                        <div class="col-sm-8 text-left">
                            <input type="text" class="form-control"  id="title" name="title" placeholder="消息标题" maxlength="21">
                        </div>
                        
                   </div>
                   <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><span class="required">*</span>类型：</label>
                      <ms:btn url="/sysMessage/selectXT.html">
                        <select class="col-sm-8 text-left" style="height: 25px;width:390px" name="type" id="type" onchange="changeRece('add');">
                       		<option value="2">用户消息</option>
                            <option value="1">系统消息</option>
                        </select>
                      </ms:btn>
                      <ms:btn url="/sysMessage/NoSelectXT.html">
                         <select class="col-sm-8 text-left" style="height: 25px;width:390px" name="type" id="type">
                       		<option value="2">用户消息</option>
                        </select>
                      </ms:btn>
                   </div>
                  
                   <div class="form-group form-group-xs" >
                        <label class="col-sm-2 text-right"><span class="required">*</span>内容：</label>
                        <div class="col-sm-8 text-left">
                            <textarea  class="form-control" rows="3" id="content" name="content" placeholder="消息内容" maxlength="1400"></textarea>
                        </div>

                   </div>
 
                    <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><i class="fa fa-plus addFa"  id="addlicence" style="color: blue;margin-right: 15px;" ></i>附件&nbsp;：</label>
                        <div class="col-sm-9 text-left">
                             <input type="file"  accept='image/*' id="addlicences" name="licences" style="display:inline-none;" />
                        </div>
                   </div>
                   <div class="addLicenceDiv"></div>
                </form>
                    </div>
              <div class="modal-footer">
                  <ms:btn url="/sysMessage/save.html"><button type="button" onclick="addSave('add',0);" class="btn btn-primary btn-sm"><spring:message code="message.button.saveSpacing"/></button></ms:btn>
                 <ms:btn url="/sysMessage/messageSend.html"><button type="button" onclick="addSave('add',1);" class="btn btn-primary btn-sm">发&nbsp;送</button></ms:btn>
              </div>
            </div>
         </div>
      </div>
      
       <div class="modal fade" id="editModal" tabindex="-1"  >
            <div class="modal-dialog">
                <div class="modal-content" >
                    <div class="modal-header bg-primary">
                        <button type="button" class="close" data-dismiss="modal" ><span >&times;</span></button>
                        <h5 class="modal-title" id="exampleModalLabel">消息编辑</h5>
                    </div>
                 <div class="modal-body" >
                  <form  class="form-horizontal" action="${ctx}/sysMessage/saveOrUpDate.html" id="editForm" method="post" enctype="multipart/form-data">
                    <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><span class="required">*</span>接收人：</label>
                        <div class="col-sm-8 text-left">
                        <input id="editmessageId" name="messageId" type="hidden" >
                        <input id="editreceUser" name="receUser" type="hidden" >
                         <input id="editstatus" name="status" type="hidden" >
                         <input id="editreceType" name="receType" type="hidden" >
                         <input id="editreceOrgId" name="receOrgId" type="hidden" >
                            <input class=" form-control" placeholder="接收人" disabled="disabled" id="editreceUserName" type="text" >
                        </div>
                        <div> <button type="button" class="btn btn-primary btn-sm" id="editaddRece" onclick="addUser('edit');" >添&nbsp;加</button></div>
                   </div>
                   <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><span class="required">*</span>标题：</label>
                        <div class="col-sm-8 text-left">
                            <input type="text" class="form-control"  id="edittitle" name="title" placeholder="消息标题" maxlength="21">
                        </div>
                        
                   </div>
                    <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><span class="required">*</span>类型：</label>
                      <ms:btn url="/sysMessage/selectXT.html"><select class="col-sm-8 text-left" style="height: 25px;width:390px" name="type" id="edittype" onchange="changeRece('edit');" >
                       		<option value="2">用户消息</option>
                            <option value="1">系统消息</option>
                        </select></ms:btn>
                        <ms:btn url="/sysMessage/NoSelectXT.html"><select class="col-sm-8 text-left" style="height: 25px;width:390px" name="type" id="edittype">
                       		<option value="2">用户消息</option>
                        </select></ms:btn>
                    </div>
                   <div class="form-group form-group-xs" >
                        <label class="col-sm-2 text-right"><span class="required">*</span>内容：</label>
                        <div class="col-sm-8 text-left">
                            <textarea  class="form-control" rows="3" id="editcontent" name="content" placeholder="消息内容" maxlength="1300"></textarea>
                        </div>
                      
                   </div>
                    <div class="form-group form-group-xs">
                        <label class="col-sm-2 text-right"><i class="fa fa-plus addFa"  id="editlicence" style="color: blue;margin-right: 15px;" ></i>附件&nbsp;：</label>
                        <div class="col-sm-9 text-left">
                             <input type="file"  accept='image/*' id="editlicences" name="licences" style="display:inline-none;" />
                        </div>
                   </div>
                   <div class="editLicenceDiv"></div>
                </form>
               </div>
              <div class="modal-footer">
                  <ms:btn url="/sysMessage/save.html"><button type="button" onclick="addSave('edit',0);" class="btn btn-primary btn-sm"><spring:message code="message.button.saveSpacing"/></button></ms:btn>
                 <ms:btn url="/sysMessage/messageSend.html"><button type="button" onclick="addSave('edit',1);" class="btn btn-primary btn-sm">发&nbsp;送</button></ms:btn>
              </div>
            </div>
         </div>
      </div>
    </section>
    
    <%@ include file="/WEB-INF/component/commonJS.jsp" %>
    
    <script type="text/javascript">
  //绑定回车
		$('#titleTitle,#schType').bind('keydown', function(event) {
    	if (event.keyCode == "13") {
        $('#selectDicCompType').click();
    		}
		});	
    $(function(){
		$(document).on("click",".addFa",function(){
		   var licencesEdit = "";
		   var licences = $(this).closest('label').siblings('.col-sm-9').find('#addlicences').val();
		   if(licences == null || licences == ""){
			   licencesEdit = $(this).closest('label').siblings('.col-sm-9').find('#editlicences').val();
			   licences = licencesEdit;
		   }
		   if("" == $.trim(licences) || null == $.trim(licences)){
			   $.HN.message.alert('请先上传附件！', '提示信息', 'error');
	           return;
		   } 
		   $(this).attr({ "class": "fa fa-times deleteFa"});
		   if(licencesEdit != "" && licencesEdit != null){
			   $(".editLicenceDiv").append("<div class='form-group form-group-xs'><label class='col-sm-2 text-right'><i class='fa fa-plus addFa' style='color: blue;margin-right: 15px;' ></i>附件&nbsp;：</label>"
					   +"<div class='col-sm-9 text-left' ><input type='file'  accept='image/*' id='editlicences' name='licences' ></div></div>");
		   }else{
			   $(".addLicenceDiv").append("<div class='form-group form-group-xs'><label class='col-sm-2 text-right'><i class='fa fa-plus addFa' style='color: blue;margin-right: 15px;' ></i>附件&nbsp;：</label>"
					   +"<div class='col-sm-9 text-left' ><input type='file'  accept='image/*' id='addlicences' name='licences' ></div></div>");
		   }
		  
		})
		$(document).on("click",".deleteFa",function(){
			   $(this).attr({ "class": "fa fa-plus addFa"});
			   $(this).closest('.form-group-xs').remove();
		})
	})
    
   
	
	 
    	function search(page) {
    		var titleTitle = $.trim($("#titleTitle").val());
    		var schType = $.trim($("#schType").val());
    		$("#gridlist").jqGrid('setGridParam',{  
    	        datatype:'json',
    	        postData:{"title":titleTitle, "type":schType},
    	        page : (page || 1)
    	    }).trigger("reloadGrid"); //重新载入  
    	}
    	
        $(function () {
        	$("#titleTitle").focus();//加载页面光标在第一个查询框上
        	
            $("#gridlist").jqGrid({
                url: "getSysMessageList.html",
                mtype: "post",
                datatype: "json",
                postData:{"messageStatus":"${messageStatus}"},
                autowidth: true,
                height: 280,
                colNames: [
                    '<spring:message code="message.jqGrid.cz"/>',
                    '消息标题',
					'消息内容', 
					'消息类型'
                ],
                colModel: [
                    { name: 'operate', width: 3, align:"center", sortable: false,
	                    formatter : function(val, opts, rowdata) {
                       	var str =  "";
			                    	str+= "<ms:btn url='/sysMessage/edit.html'><a href='javascript:edit(\""+rowdata.messageId+"\");' style='background:url(${ctx}/lib/img/icon/icon.png) no-repeat 0px 0px' class='opIcon' title='编辑'></a></ms:btn>"
			                	   str+= "<ms:btn url='/sysMessage/messageSend.html'><a href='javascript:messageSend(\""+rowdata.messageId+"\");' style='background:url(${ctx}/lib/img/icon/icon.png) no-repeat -100px -100px' class='opIcon' title='发送'></a></ms:btn>"
    	                return str;
                    }},
					{ name: 'title', width: 5, align:"center", sortable: false},
                    { name: 'content', width: 21, align:"center", sortable: false},
                    { name: 'type', width: 5, align: 'center', sortable: false}
                   
                    
                ],
                rowNum: 20,
                rowList: [10, 20, 50, 100],
                rownumbers: true,
                pager: "#gridpage",
                viewrecords: true,
                caption: '消息列表',
                jsonReader: {
                    id: "id"
                }
            });
            
            $("#gridlist").jqGrid('navGrid', '#gridpage', { add: false, edit: false, del: false, search: false, refresh: false });
            
            $(window).trigger("resize");
            
        });
        
        //新增
             $('#addNew').click(function () {
  				$("#messageId").val("");
  				$("#receUser").val("");
   				$("#receUserName").val("");
   				$("#title").val("");
   				$("#content").val("");
   				$("#receOrgId").val("");
   				$("#addlicences").val("");
   				$(".addLicenceDiv").html("");
                $('.modal-title').html('消息新增');
                
                $('#exampleModal').modal({
                    keyboard: true
                });
            });
             //编辑
             function edit(id){
            	var messageId = id || "";
            	$("#editmessageId").val("");
 				$("#editreceUser").val("");
  				$("#editreceUserName").val("");
  				$("#edittitle").val("");
  				$("#edittype").val("");
  				$("#editcontent").val("");
  				$("#editreceOrgId").val("");
  				$("#editlicences").val("");
  				$(".editLicenceDiv").html("");
         		$.post("editMessage.html", {
         			messageId : messageId
         		},
         		function(result) {
         			if (result.success) {
         				var obj = result.rows;
         				$('.modal-title').html('消息编辑');
         				$("#editmessageId").val(obj.messageId);
         				$("#editreceUser").val(obj.receUser);
          				$("#editreceUserName").val(obj.receUserName);
          				$("#edittitle").val(obj.title);
          				$("#edittype").val(obj.type);
          				if(obj.type == 1){
          					$("#editreceUserName").val("All;");
          					 $("#editaddRece").attr("disabled",true);
          				}
          				$("#editcontent").val(obj.content);
          				$("#editreceOrgId").val(obj.recOrgId);
          				if(obj.url != "" && obj.url != null){
          				    var strsUrl = new Array();
          				    var strFileName = new Array();
          				    strsUrl = obj.url.split(",");
          				    strFileName = obj.fileName.split(",");
          				  for(var i=0;i<strsUrl.length-1;i++){
          					  $(".showLicenceDiv").append("<div class='form-group form-group-xs'><label class='col-sm-2 text-right'><i class='fa fa-times deleteFa' style='color:#3c8dbc;margin-right: 15px;' ></i>附件&nbsp;：</label>"
              						  +"<div class='col-sm-3 text-left'><input type='hidden' name='strNames' value='"+strFileName[i]+"'/>"+strFileName[i]+"<input type='hidden' name='strUrls' value='"+strsUrl[i]+"'/> </div></div><br>	</br>");
          				  }  
          				}
          				
                          $('#editModal').modal({
                              keyboard: true
                          });
         			}
         			
         		}, "json");
               
                
             }
             
             function messageLook(id){
            	 $.HN.dialog.opendialog(1,"消息详情","${ctx}/sysMessage/toMessageDetail.html?messageId="+id,"800px","380px",operHospResult);
             }
             
             function messageSend(id){
            		var messageId = id || "";
             		$.post("sendMessage.html", {
             			messageId : messageId,
             			status : 1
             		},
             		function(result) {
             			if (result.success) {
             				  top.$.alert("<spring:message code="message.HN.alert.success"/>", "success");
                              $("#gridlist").jqGrid('setGridParam',{page:1}).trigger("reloadGrid");
                          }else{
                              top.$.alert(result.msg || "<spring:message code="message.HN.alert.fail"/>", "error");
                                  }
             			
             		}, "json");
             }
             function addUser(str){
            	 var receUser = "receUser";
            	 var receUserName = "receUserName";
            	 var receType = "receType";
            	 var receOrgId = "receOrgId";
            	 if(str == "edit"){
            		 receUser = "editreceUser";
            		 receUserName = "editreceUserName";
                	 receType = "editreceType";
                	 receOrgId = "editreceOrgId";
            	 }
            	 var url = "${ctx}/sysMessage/toUserList.html?receUser=" + $("#"+receUser).val();
         		$.HN.dialog.open({
         			"id": "addUser", 
         			"title": "<spring:message code="message.list.YongHuXuanZeLieBiao"/>", 
         			"url": url, 
         			"data": {}, 
         			"width": 800, 
         			"height": 400, 
         			"closefunc":function(userList) {
         				if (userList.length > 0) {
             				var userIds = "";
             				var names = "";
             				var type = "";
                       	    var orgId = "";
             				for (var i=0; i<userList.length; i++) {
             					var user = userList[i];
             					userIds += user.userId;
             					names += user.userName;
             					type += user.type;
        	     				orgId += user.orgId;
             					if (i < userList.length - 1) {
             						userIds += ",";
             						names += "; ";
             						type +=  ",";
            	     				orgId += ",";
             					}
             				}
             				$("#"+receUser).val(userIds);
             				$("#"+receUserName).val(names);
             				$("#"+receType).val(type);
        	 				$("#"+receOrgId).val(orgId);
             			}
         			}
         		});
             }
             
           //新增保存
             function addSave(str,status){
        	   
                 if(!validate(str)){
                	 return;
                 }
                 var strNameForm = "addForm";
                 if(str == "edit"){
                	 strNameForm = "editForm"; 
                	 $("#editstatus").val(status);
                 }else{
                	 $("#status").val(status);
                 }
                 var msg = "确定保存信息到草稿箱吗？";
                 if(status == 1){
                	 msg = "确定将消息发送吗？";
                 }
                     $.HN.message.confirm(msg, '', '').on(function (e) {
                        if (e) {
                        	$("#"+strNameForm).ajaxSubmit({
                            dataType:"json",
                            success: function(result){
                                if(result.success){
                                 $.alert("<spring:message code="message.HN.alert.success"/>", "success");
                                    $("#gridlist").jqGrid('setGridParam',{page:1}).trigger("reloadGrid");
                                    if(str == "edit"){
                                    	 $('#editModal').modal('hide');
                                    }else{
                                    	  $('#exampleModal').modal('hide');
                                    }
                                }else{
                                    $.alert(result.msg || "<spring:message code="message.HN.alert.fail"/>", "error");
                                        }
                                    }
                             });
                         }
                  });
             } 
           
            //校验
             function validate(str) {
            	var strReceUser = "receUser";
            	if(str == "edit"){
            		strReceUser = "editreceUser";
            	}
            	 var receUser = $.trim($("#"+strReceUser).val());
                 if (receUser == null || receUser == "") {
                	 top.$.alert("请选择消息接收人！", "warn");
                     return false;
                 } 
                 $("#"+strReceUser).val(receUser);
            	
            	var strNameTile = "title";
            	if(str == "edit"){
            		strNameTile = "edittitle";
            	}
                var title = $.trim($("#"+strNameTile).val());
                if (title == null || title == "") {
                	 top.$.alert("请填写消息标题名称！", "warn");
                    return false;
                } else if(title.length > 21){
                	 top.$.alert("填写的消息标题名称字数不能超过21个！", "warn");
                     return false;
                }
                $("#"+strNameTile).val(title);
                
                var strNameContent = "content";
                	if(str == "edit"){
                		strNameContent = "editcontent";
                	}
                var content = $.trim($("#"+strNameContent).val());
                if (content == null || content == "") {
                	 top.$.alert("请编写消息内容！", "warn");
                    return false;
                }else if(content.length > 1300){
                	 top.$.alert("填写的消息内容字数不能超过1400个！", "warn");
                    return false;
                }
                $("#"+strNameContent).val(content);
                return true;
            }
            
             function showImg(imgPath, profileName) {
                 var url = "${ctx}/acctInfo/toImg.html";
                 $.HN.dialog.open({
                     "id" : "showImg",
                     "title" : profileName,
                     "url" : url,
                     "data" : {
                         "imgPath" : imgPath
                     },
                     "width" : 800,
                     "height" : 400
                 });
             }
             
             function changeRece(strType){
            	 var typeId  = "" ;
            	 var receUserName = "";
            	 var receButton = "";
            	 if(strType == "edit"){
            		 typeId = "edittype";
            		 receUserName = "editreceUserName";
            		 receButton  = "editaddRece";
            	 }else{
            		 typeId = "type"
            	     receUserName = "receUserName";
            		 receButton  = "addRece";
            	 }
            	 var receType = $("#"+typeId).val();
            	 if(receType == 1){
            		 $("#"+receUserName).val("All;");
            		 $("#"+receButton).attr("disabled",true);
            	 }else{
            		 $("#"+receUserName).val("");
            		 $("#"+receButton).attr("disabled",false);
            	 }
             }          
    </script>
</body>
</html>